<template>
	<gui-page>
		<view class="main gui-padding" slot="gBody">
			<view class="heder_con"></view>
			<view class="title f32 blod">
				{{dataRes.title}}
			</view>
			<view class="con">
				<mp-html :content="$u.richImg(dataRes.content)" ref="article" />
			</view>
		</view>
	</gui-page>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex';
	export default {
		computed: {
			...mapState(['hasLogin'])
		},
		data() {
			return {
				dataRes: {
					content: ''
				},
				noticeId: ''
			}
		},
		onLoad(e) {
			if (this.hasLogin && e.id) {
				this.noticeId = e.id;
				this.loadData();
			}
		},
		methods: {
			...mapActions(['updateReload']),
			loadData(isReload) {
				this.$api.getNoticeDetails({
					noticeId: this.noticeId
				}).then(res => {
					this.dataRes = res.data;
					this.updateReload(true);
				})
			},
		}
	}
</script>

<style lang="scss">
	.title {
		text-align: center;
		margin-top: 60rpx;
	}

	.blod {
		font-weight: bold;
	}

	.con {
		padding: 0 60rpx;
		margin-top: 30rpx;
	}

	.main {}

	.heder_con {
		height: 1rpx;
		box-shadow: 0px 3rpx 30rpx 1rpx rgba(0, 0, 0, 0.16);
	}
</style>